import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { resolve } from 'path'
import styleImport from 'vite-plugin-style-import' // vant按需引入
import viteSvgIcons from 'vite-plugin-svg-icons'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    styleImport({
      libs: [
        {
          libraryName: 'vant',
          esModule: true,
          resolveStyle: (name) => {
            return `vant/es/${name}/style/index`
          }
        }
      ]
    }),
    /**
     *  把src/icons 下的所有svg 自动加载到body下，供组件使用
     *  类似于webpack中的svg-sprite-loader
     *  文档：https://github.com/anncwb/vite-plugin-svg-icons
     */
    viteSvgIcons({
      // 指定需要缓存的图标文件夹
      iconDirs: [resolve(process.cwd(), 'src/icons/svg')],
      // 指定symbolId格式
      symbolId: 'icon-[name]'
    })
  ],
  // 服务
  server: {
    open: true,
    // port: 8081,
    // 代理配置
    proxy: {
      '/api': {
        target: 'http://192.168.0.111:8899/contract-manage/',
        // target: 'http://192.168.0.113:8899/contract-manage/',
        rewrite: (path) => path.replace(/^\/api/, ''),
        changeOrigin: true
      }
    }
  },
  build: {
    // 打包后目录,默认dist
    outDir: 'dist'
  },
  resolve: {
    alias: {
      '@': resolve(__dirname, 'src')
    }
  },
  css: {
    // 预处理器
    preprocessorOptions: {
      less: {
        javascriptEnabled: true
        // additionalData: `@import "./src/assets/common/common.less";` //引用公共样式
        // 使用vite搭建项目只安装sass即可，不需要安装node-sass,sass-loader
      }
    }
  }
})
